<template>
	<view class="form">

		<an-layer ref="anRef" autoClose="true" timer="3" :type="type"></an-layer>

		<!-- 城市简称键盘 -->
		<view v-if="citytxtIsshow" class="fixed">
			<view class="mask" @tap="onMask('city')"></view>
			<view class="fixeds">
				<city :citytxt="citytxt" @changecity="changecity" @onMask="onMask(i)" />
			</view>
		</view>

		<!-- 车牌键盘 -->
		<view v-if="carnumberIsshow" class="fixed">
			<view class="mask" @tap="onMask('carnumber')"></view>
			<view class="fixeds">
				<carnumber @click="getcarnumber" />
			</view>
		</view>

		<!-- 上传照片 -->
		<view class="paragraph">
			<view style="color: #555; padding: 20rpx;">
				*尽量上传电子保单或扫描件，若手机拍摄，保证光线明亮，保单不能有明显褶皱，每个字清晰可见
			</view>

			<view class="upload">

				<view class="img">
					<view class="close fonticon" v-if="previewdrivingLicense" @tap="deleteimg(1)">
						&#xe612;
					</view>
					<form v-if="!previewdrivingLicense" @submit='upload1' report-submit='true'>
						<view  class="header">

							<button class="absolute" form-type='submit'></button>
							<view class="fonticon size">
								&#xe6e8;
							</view>
							<view>上传行驶证正页</view>

						</view>
					</form>
					<image @tap="lookImg(1)" v-else class="header" :src="previewdrivingLicense" ></image>
					<view class="txt" @tap="preview(1)">预览示例</view>
				</view>

				<view class="img">
					<view class="close fonticon" v-if="previewsidelinetravel" @tap="deleteimg(2)">
						&#xe612;
					</view>
					<form v-if="!previewsidelinetravel" @submit='upload2' report-submit='true'>
						<view class="header">
							<button class="absolute" form-type='submit'></button>
							<view class="fonticon size">
								&#xe6e8;
							</view>
							<view>上传行驶证副页</view>
						</view>
					</form>
					<image @tap="lookImg(2)" v-else class="header" :src="previewsidelinetravel"></image>
					<view class="txt" @tap="preview(2)">预览示例</view>
				</view>

				<view class="img">
					<view class="close fonticon" v-if="previewInsurance" @tap="deleteimg(3)">
						&#xe612;
					</view>
					<form v-if="!previewInsurance" @submit='upload3' report-submit='true'>
						<view  class="header">
							<button class="absolute" form-type='submit'></button>
							<view class="fonticon size">
								&#xe6e8;
							</view>
							<view style="text-align: center;">上传有效期内交强险保单</view>
						</view>
					</form>
					<image @tap="lookImg(3)" v-else class="header" :src="previewInsurance"></image>

					<view class="txt" @tap="preview(3)">预览示例</view>
				</view>

			</view>

		</view>





		<!-- 车辆信息 -->
		<view class="paragraph">


			<!-- 车牌号码 -->
			<view class="input">
				<view class="left">车牌号码</view>
				<view class="right">
					<view class="carnumber">
						<view class="city" @tap="onkeyboard('city')">{{citytxt}}</view>
						<view class="number" @tap="onkeyboard('carnumber')">{{carnumber}}</view>
					</view>
				</view>
			</view>


			<!-- 车辆性质 -->
			<view class="input">
				<view class="left">车辆性质</view>
				<view class="right">
					<radio-group @change="changenature" style="display: flex;">
						<label v-for="(item, index) in nature" :key="index" style="display: flex; align-items: center; margin-right: 10rpx;">
							<radio :value="item.value" :checked="index === current" />
							<view>{{item.name}}</view>
						</label>
					</radio-group>
				</view>
			</view>

			<!--确定无伤亡事故  -->
			<view class="input">
				<view class="left">确定无伤亡事故</view>
				<view class="right flex">
					<view class="switch">
						<switch @change="casualtiesSwitch" :checked="casualties"/>
					</view>
				</view>
			</view>


			<!--确定已处理违章  -->
			<view class="input">
				<view class="left">确定已处理违章</view>
				<view class="right flex">
					<view class="switch">
						<switch @change="violationSwitch" :checked="violation"/>
					</view>
				</view>
			</view>

			<!--确定交强险有效  -->
			<view class="input">
				<view class="left">确定交强险有效</view>
				<view class="right flex">
					<view class="switch">
						<switch @change="insuranceSwitch" :checked="insurance"/>
					</view>
				</view>
			</view>



		</view>


		<!-- 个人信息 -->
		<view class="paragraph">

			<!--收货地址  -->
			<view class="input">
				<view class="left">收货地址</view>
				<view class="right ">
					<picker @change="cityChange" mode="region" :value="regionindex" :range="region">
						<view class="uni-input">{{city}}</view>
					</picker>
				</view>
			</view>

			<!-- 收货地址详细 -->
			<view class="input">
				<view class="left"></view>
				<view class="right">
					<input type="text" v-model="address" placeholder="请输入详细地址 例:5号楼186号">
				</view>
			</view>


			<!-- 收件人 -->
			<view class="input">
				<view class="left">收件人</view>
				<view class="right">
					<input type="text" v-model="name" placeholder="请填写收件人">
				</view>
			</view>

			<!-- 收件电话 -->
			<view class="input">
				<view class="left">收件电话</view>
				<view class="right">
					<input type="number" v-model="phone" placeholder="请填写收件电话">
				</view>
			</view>

			<!-- 备注 -->
			<view class="input">
				<view class="left">备注</view>
				<view class="right">
					<input type="text" v-model="msg" placeholder="按需填写" />
				</view>
			</view>



		</view>



		<!-- 车辆信息 -->
		<!-- <view class="paragraph" v-if="isshow"> -->

		<!-- 车辆识别代-->
		<!-- <view class="input">
				<view class="left">车辆识别代号</view>
				<view class="right">
					<input type="text" v-model="vin" placeholder="请输入车辆识别代">
				</view>
			</view> -->

		<!-- 发动机号-->
		<!-- <view class="input">
				<view class="left">发动机号</view>
				<view class="right">
					<input type="text" v-model="engine_num" placeholder="请输入发动机号">
				</view>
			</view>
 -->
		<!-- 发动机号-->
		<!-- <view class="input">
				<view class="left">注册日期</view>
				<view class="right ">
					<picker @change="registerDateChange" mode="date" :value="register_date">
						<view class="uni-input">{{register_date}}</view>
					</picker>
				</view>

			</view> -->

		<!-- 发证日期-->
		<!-- <view class="input">
				<view class="left">发证日期</view>
				<view class="right ">
					<picker @change="issueDateChange" mode="date" :value="issue_date">
						<view class="uni-input">{{issue_date}}</view>
					</picker>
				</view>

			</view> -->


		<!-- </view> -->






		<!-- 支付方式 -->
		<view class="paragraph">
			<view style="padding: 10rpx 20rpx;">支付方式</view>
			<view class="input">
				<view class="left payflex">
					<view class="pay fonticon">
						&#xe689;
					</view>
					<view>微信支付</view>
				</view>

				<view class="right flex">
					<label>
						<radio checked />
					</label>
				</view>
			</view>
		</view>



		<!-- 注意事项 -->
		<view class="paragraph">
			<view style="background-color: #fff;padding: 20rpx; display: flex;">
				<view class="fonticon" style="width: 10%;">&#xe71b;</view>
				<view style="font-size: 22rpx;">
					办理车辆要求：7座以下的非营运小型，微型载客汽车，无伤亡事故
				</view>
			</view>
		</view>


		<!-- 占高度 -->
		<view style="height: 100rpx;"></view>

		<view class="bottom">
			<view class="left">
				<view>
					<view>￥{{payprice}}</view>
					<view>邮费到付</view>
				</view>
			</view>

			<view class="right auth">
				<!-- #ifdef MP-WEIXIN -->
				<button class="getuser" lang="zh_CN" open-type="getUserInfo" @getuserinfo="pay" withCredentials="true">微信授权获取用户信息</button>
				<!-- #endif -->

				<view>
					立即下单
				</view>
			</view>
		</view>



	</view>
</template>

<script>
	import city from '@/components/city'
	import carnumber from '@/components/carnumber'
	import anLayer from '@/components/an-layer/an-layer.vue'

	import amap from '@/common/amap-wx.js'
	import MD5Util from '@/common/md5.js'

	// 接口相关
	import _function from '@/common/_function.js'
	import api from '@/common/api.js'

	export default {
		components: {
			city,
			carnumber,
			anLayer
		},
		data() {
			return {

				region: [], //城市信息
				city: '选择城市',
				regionindex: 0,
				address: '', //收货地址
				name: '', //收件人
				phone: '', //电话
				msg: '', //备注信息

				amapPlugin: null, //高德地图
				key: '8ae848c408f1cdfdb2e1cdab0ee0d16a', //key



				nature: [{
						value: 1,
						name: '个人'
					},
					{
						value: 2,
						name: '单位'
					}
				],
				current: 0, // 默认选中个人
				naturecurrent: 1, // 要提交的车辆性质 1=个人 2=单位
				casualties: false, //伤亡是否选中
				violation: false, //违章是否选中
				insurance: false, //交强险是否选中
				citytxt: '', //城市简称
				citytxtIsshow: false, //城市键盘遮罩层
				carnumberIsshow: false, // 车牌键盘
				carnumber: '', //车牌号



				sidelinetravel: '', //要上传的行驶证副页
				previewsidelinetravel: '', // 暂时预览的行驶证副页

				drivingLicense: '', //要上传的行驶证正页面
				previewdrivingLicense: '', // 暂时预览的行驶证正面

				insuranceimg: '', //要上传的交强险照片
				previewInsurance: '', //暂时预览的交强险照片

				distinguishres: {}, //行驶证照片识别结果

				payprice: getApp().globalData.payprice

			};
		},

		methods: {
			
			
			// 删除上传的图片
			deleteimg(i){
				switch(i){
					case 1:
						this.drivingLicense = ''
						this.previewdrivingLicense = ''
					break
					case 2:
						this.sidelinetravel = ''
						this.previewsidelinetravel = ''
					break
					case 3:
						this.insuranceimg = ''
						this.previewInsurance = ''
					break
				}
			},
			
			// 查看上传的行驶证图片
			lookImg(i){
				let img = ''
				switch(i){
					case 1:
						img = this.previewdrivingLicense 
					break
					case 2:
						img = this.previewsidelinetravel
					break
					case 3:
						img = this.previewInsurance
					break
					
				}
				let arr = [img]
				uni.previewImage({
					urls: arr
				})
			},
			
			
			// 选择城市信息
			cityChange(e) {
				console.log(e)
				this.city = e.detail.value.join(' ')
			},

			// 立即下单
			async pay(e) {
				if (e.detail.iv || e.detail.signature) {

					const res = await _function.request(api.getuserinfo)

					let bol = false
					if (res.data.code == 200) {
						bol = true
					} else {
						bol = await _function.login(e.detail.userInfo)
						if (bol) {
							getApp().globalData.islogin = true
						}

					}

					// ture 表示登录成功 false表示登录失败
					if (bol) {


						let {
							carnumber, //车牌信息
							drivingLicense, //要上传的行驶证正页
							sidelinetravel, //要上传的行驶证副页

							insuranceimg, //要上传的交强险图片
							naturecurrent, //车辆性质


							payprice, //支付金额


							city, //选择的城市
							address, //具体收货地址
							name, //姓名
							phone, //电话
							msg, //留言信息



							distinguishres, //智能识别的结果
							citytxt //城市简称
						} = this
						console.log(drivingLicense)

						// 效验三个开关是否勾选
						if (!this.casualties) {
							uni.showToast({
								title: '请先确定车辆无伤亡情况',
								duration: 2000,
								icon: 'none'
							})
							return false
						} else if (!this.violation) {
							uni.showModal({
								title: '提示',
								content: '请确定车辆无违章，如有违章，请先处理',
								confirmText: '前往处理',
								success: (res) => {
									if (res.confirm) {
										let url = escape("https://www.zzhaolei.com/index.php?s=/Weizhang/carlist.html");

										uni.navigateTo({
											url: `../h5/h5?url=${url}`
										})
									}
								}
							})

							return false
						} else if (!this.insurance) {
							uni.showToast({
								title: '请先确定交强险是否在有效期内',
								duration: 2000,
								icon: 'none'
							})
							return false

						} else if (!drivingLicense.length) {
							uni.showToast({
								title: '请上传行驶证正页',
								duration: 2000,
								icon: 'none'
							})
							return false
						} else if (!sidelinetravel.length) {
							uni.showToast({
								title: '请上传行驶证副页',
								duration: 2000,
								icon: 'none'
							})
							return false
						} else if (!insuranceimg.length) {
							uni.showToast({
								title: '请上传交强险照片',
								duration: 2000,
								icon: 'none'
							})
							return false

						} else if (city === '选择城市') {
							uni.showToast({
								title: '请选择城市',
								duration: 2000,
								icon: 'none'
							})
							return false
						} else if (!address.length) {
							uni.showToast({
								title: '请输入收货地址',
								duration: 2000,
								icon: 'none'
							})
							return false
						} else if (!name.length) {
							uni.showToast({
								title: '请填写收件人姓名',
								duration: 2000,
								icon: 'none'
							})
							return false
						} else if (phone.length != 11) {
							uni.showToast({
								title: '手机号长度错误',
								duration: 2000,
								icon: 'none'
							})
							return false
						}



						// 请求中
						uni.showLoading({
							title: '提交中...',
							mask: true
						})

						// 车牌
						let carbrand = citytxt + carnumber
						console.log(drivingLicense)

						// 通过检测
						const res = await _function.request(api.orderpay, {
							carbrand, //车牌
							price: payprice, //订单金额

							nature: naturecurrent, //车辆性质1=个人 2=单位

							address: city + ' ' + address, //收货地址
							name, //收货人
							phone, //电话
							msg, //留言信息

							drivinglicense: drivingLicense, //行驶证正页
							sidelinetravel, //行驶证副页
							insurance: insuranceimg, //交强保险 
							agent: citytxt, //代理商--城市简称	
							distinguishres,
						}, 'post')



						if (res.data.code == 200) {
							res.data.data.payinfo = JSON.parse(res.data.data.payinfo)
							// this.orderid = res.data.data.orderid

							let appId = res.data.data.payinfo.appid
							let timeStamp = parseFloat(res.data.data.payinfo.timeStamp).toString()
							let pkg = 'prepay_id=' + res.data.data.payinfo.prepay_id
							let nonceStr = res.data.data.payinfo.nonce_str
							let sign = res.data.data.payinfo.sign
							let paySign = MD5Util.MD5('appId=' + appId + '&nonceStr=' + nonceStr + '&package=' + pkg +
								'&signType=MD5&timeStamp=' + timeStamp + "&key=" + res.data.data.payinfo.apikey)

							// 仅作为示例，非真实参数信息。
							uni.requestPayment({
								provider: 'wxpay',
								timeStamp: timeStamp,
								nonceStr: nonceStr,
								package: pkg,
								signType: 'MD5',
								paySign: paySign,
								success: (res) => {
									uni.hideLoading()
									this.$refs.anRef.show("支付成功！", {
										type: 'success'
									})
									setTimeout(() => {
										uni.reLaunch({
											url: '../index/index'
										})
									}, 1000)
									
									
									
								},
								fail: (err) => {

									console.log('支付失败')
									uni.hideLoading()
									this.$refs.anRef.show("支付失败！", {
										type: 'error'
									})
									
									
									// 删除失败的订单
									_function.request(api.deleteorder)
									
								}

							})
						}else if (res.data.code == 400) {
							uni.hideLoading()
							uni.showModal({
								title: '提示',
								content: res.data.msg,
								showCancel: false
							})
						} else if (res.data.code == 401) {
							uni.hideLoading()
							//删除支付失败的订单
							// _function.request(api.deleteorder,{
							// 	order_id:res.data.data
							// },'POST')
							uni.showModal({
								title: '提示',
								content: res.data.msg,
								showCancel: false
							})
						} else if (res.data.code == 201) {
							uni.hideLoading()
							uni.showModal({
								title: '提示',
								content: res.data.msg,
								showCancel: false,
								success:(res) => {
									uni.uni.navigateBack({
										delta: 1
									})
								}
							})
						} else {
							uni.hideLoading()
							uni.showModal({
								title: '提示',
								content: '服务器错误',
								showCancel: false,
								success: (res) => {

								}
							})
						}

					}
				} else {
					console.log('接口调用失败')
				}




			},

			// 注册日期改变
			registerDateChange(e) {
				this.register_date = e.detail.value
			},

			// 发证日期改变
			registerDateChange(e) {
				this.issue_date = e.detail.value
			},

			// 预览示例中的图片
			async preview(i) {
				let url = ''
				const res = await _function.request(api.getimg)
				console.log(res)
				if (res.data.code == 200) {
					// 展示行驶证照片
					if (i === 1) {
						// 行驶证正页
						url = res.data.data.drivingLicense
					} else if (i === 2) {
						// 行驶证副页
						url = res.data.data.sidelinetravel
					} else {
						// 交强险示例
						url = res.data.data.insurance
					}

					uni.previewImage({
						urls: [
							url
						],
						longPressActions: {
							itemList: ['发送给朋友', '保存图片', '收藏'],
							success: function(data) {
								console.log('选中了第' + (data.tapIndex + 1) + '个按钮,第' + (data.index + 1) + '张图片');
							},
							fail: function(err) {
								console.log(err.errMsg);
							}
						}
					})
				} else {
					uni.showToast({
						title: '图片获取失败',
						icon: 'none',
						duration: 2000
					})
				}

			},

			// 上传行驶证正面
			upload1(e) {
				// 给服务端发送formid
				_function.request(api.formid,{
					formid:e.detail.formId
				},'POST')
				
				uni.chooseImage({
					count: 1, //默认9
					sizeType: ['original', 'compressed'], //可以指定是原图还是压缩图，默认二者都有
					sourceType: ['album', 'camera'], //从哪里选择图片 相册和相机
					success: (res) => {
						this.previewdrivingLicense = res.tempFilePaths[0]
						// 上传行驶证正面
						uni.uploadFile({
							url: api.uplode_img,
							filePath: res.tempFilePaths[0],
							name: 'img',
							success: async (res) => {
								let data = JSON.parse(res.data)
								this.drivingLicense = data.url
								// 上传成功调用识别图像接口
								const result = await _function.request(api.distinguish, {
									img: data.url
								}, 'post')
								if (result.data.code == 200) {
									let {
										addr,
										engine_num,
										issue_date,
										model,
										owner,
										plate_num,
										register_date,
										use_character,
										vehicle_type,
										vin
									} = result.data.data
									this.distinguishres.addr = addr
									this.distinguishres.engine_num = engine_num
									this.distinguishres.issue_date = issue_date
									this.distinguishres.model = model
									this.distinguishres.owner = owner
									this.distinguishres.plate_num = plate_num
									this.distinguishres.register_date = register_date
									this.distinguishres.use_character = use_character
									this.distinguishres.vehicle_type = vehicle_type
									this.distinguishres.vin = vin
								}
							},
							fail() {
								uni.showToast({
									title: '上传失败',
									duration: 2000,
									icon: 'none'
								})
							}
						})
					},
				})
			},

			// 上传行驶证正面
			upload2(e) {
				// 给服务端发送formid
				_function.request(api.formid,{
					formid:e.detail.formId
				},'POST')
				uni.chooseImage({
					count: 1, //默认9
					sizeType: ['original', 'compressed'], //可以指定是原图还是压缩图，默认二者都有
					sourceType: ['album', 'camera'], //从哪里选择图片 相册和相机
					success: (res) => {
						// 行驶证副面预览
						this.previewsidelinetravel = res.tempFilePaths[0]
						// 上传行驶证副面
						uni.uploadFile({
							url: api.uplode_img,
							filePath: res.tempFilePaths[0],
							name: 'img',
							success: async (res) => {
								let data = JSON.parse(res.data)
								this.sidelinetravel = data.url
								// 上传成功调用识别图像接口
								const result = await _function.request(api.distinguish, {
									img: data.url
								}, 'post')
								if (result.data.code == 200) {
									let {
										plate_num_b,
										prepare_quality,
										record,
										total_quality,
										passengers_num
									} = result.data.data
									this.distinguishres.plate_num_b = plate_num_b
									this.distinguishres.passengers_num = passengers_num
									this.distinguishres.prepare_quality = prepare_quality
									this.distinguishres.record = record
									this.distinguishres.total_quality = total_quality
								}
							},
							fail() {
								uni.showToast({
									title: '上传失败',
									duration: 2000,
									icon: 'none'
								})
							}
						})
					},
				})
			},

			// 上传交强险
			upload3(e) {
				// 给服务端发送formid
				_function.request(api.formid,{
					formid:e.detail.formId
				},'POST')
				uni.chooseImage({
					count: 1, //默认9
					sizeType: ['original', 'compressed'], //可以指定是原图还是压缩图，默认二者都有
					sourceType: ['album', 'camera'], //从哪里选择图片 相册和相机
					success: (res) => {
						this.previewInsurance = res.tempFilePaths[0]
						// 上传交强险
						uni.uploadFile({
							url: api.uplode_img,
							filePath: res.tempFilePaths[0],
							name: 'img',
							success: (res) => {
								let data = JSON.parse(res.data)
								this.insuranceimg = data.url
							},
							fail() {
								uni.showToast({
									title: '上传失败',
									duration: 2000,
									icon: 'none'
								})
							}
						})
					},
				})
			},



			// 子组件改变城市简称
			changecity(item) {
				this.citytxt = item
				this.citytxtIsshow = false
			},


			// 子组件触发的
			getcarnumber(item) {
				console.log(item)
				console.log(this.carnumber)
				if (item === '删除') {
					console.log('删除')
					this.carnumber = this.carnumber.substring(0, this.carnumber.length - 1)
				} else if (item === '返回') {
					this.carnumberIsshow = false
					console.log(this)
				} else {
					this.carnumber += item;
				}
			},

			//改变键盘
			onkeyboard(e) {
				console.log(e)
				if (e === 'carnumber') {
					// 输入车牌号
					if (this.carnumber === "请输入车牌") {
						this.carnumber = ''
					}

					this.carnumberIsshow = true
				} else {
					// 选择城市
					this.citytxtIsshow = true
				}
			},

			// 关闭遮罩层
			onMask(i) {
				console.log(i)
				if (i === 'carnumber') {
					console.log('关闭输入车牌号键盘')
					if (this.carnumber.length == 0) {
						this.carnumber = '请输入车牌'
					}
					this.carnumberIsshow = false
				} else {
					console.log('关闭输入城市键盘')
					this.citytxtIsshow = false
				}
			},

			// 改变车辆性质
			changenature(e) {

				this.naturecurrent = Number(e.detail.value)
				console.log(this.naturecurrent)
			},



			// 伤亡开关
			casualtiesSwitch(e) {
				this.casualties = e.detail.value
				
			},
			// 违章开关
			violationSwitch(e) {
				this.violation = e.detail.value
			},
			// 交强险开关
			insuranceSwitch(e) {
				this.insurance = e.detail.value
			}

		},

		// 页面加载
		async onLoad(options) {
			console.log(options)
			this.citytxt = options.citytxt
			this.carnumber = options.carnumber


			// 创建高德地图实例
			this.amapPlugin = new amap.AMapWX({
				key: this.key
			})
			// 高德地图获取位置信息
			this.amapPlugin.getRegeo({
				success: (data) => {
					console.log(data)
					this.city = data[0].regeocodeData.addressComponent.province + ' ' + data[0].regeocodeData.addressComponent.city +
						' ' + data[0].regeocodeData.addressComponent.district
				},
				fail: err => {
					uni.showToast({
						title: '调用位置接口失败',
						duration: 2000,
						icon: 'none'
					})
				}
			})


			// 判断用户是否授权
			uni.getSetting({
				success: (res) => {
					if (res.authSetting['scope.userInfo']) {
						this.auth = true
						console.log('已经授权了！！')
					}
				}
			})
			
			
			// 获取失败的订单
			let failOrder =  await _function.request(api.failOrder)
			if(failOrder.data.code==200){
				if(failOrder.data.data!='null'){
					console.log(failOrder)
					
					uni.showModal({
					    title: '提示',
					    content: failOrder.data.msg,
						cancelText:'重新填写',
						confirmText:'确定导入',
					    success:  (res) => {
					        if (res.confirm) {
					            
								let{
									carbrand,
									name,
									phone,
									address,
									nature,
									msg,
									
									
									drivinglicense,
									sidelinetravel,
									insurance,
									
									
									addr,
									engine_num,
									issue_date,
									model,
									owner,
									plate_num,
									register_date,
									use_character,
									vehicle_type,
									vin,
									plate_num_b,
									passengers_num,
									prepare_quality,
									record,
									total_quality
								} = failOrder.data.data
								
								this.casualties = true
								this.violation = true
								this.insurance = true
								
								this.citytxt = carbrand.substring(0,1)
								this.carnumber = carbrand.substring(1,carbrand.length)
								this.name = name
								this.phone = phone
								let addre = address.split(' ')
								console.log(addre)
								if(addre.length==2){
									this.city = addre[0]
									this.address = addre[1]
								}else if(addre.length==4){
									this.city = addre[0]+addre[1]+addre[2]
									this.address = addre[3]
								}
								this.msg = msg
								
								
								
								this.drivingLicense = drivinglicense
								this.previewdrivingLicense = drivinglicense
								
								
								this.sidelinetravel = sidelinetravel
								this.previewsidelinetravel = sidelinetravel
								
								this.insuranceimg = insurance
								//要预览的交强险保单
								this.previewInsurance = insurance
								
								
								this.naturecurrent = nature
								
								
								// 行驶证正面识别的数据
								this.distinguishres.addr = addr
								this.distinguishres.engine_num = engine_num
								this.distinguishres.issue_date = issue_date
								this.distinguishres.model = model
								this.distinguishres.owner = owner
								this.distinguishres.plate_num = plate_num
								this.distinguishres.register_date = register_date
								this.distinguishres.use_character = use_character
								this.distinguishres.vehicle_type = vehicle_type
								this.distinguishres.vin = vin
								// 行驶证副面识别的数据
								this.distinguishres.plate_num_b = plate_num_b
								this.distinguishres.passengers_num = passengers_num
								this.distinguishres.prepare_quality = prepare_quality
								this.distinguishres.record = record
								this.distinguishres.total_quality = total_quality
								
					        } else if (res.cancel) {
					            
					        }
					    }
					})
					
					
				}
			}

		}
	}
</script>

<style lang="scss">
	.form {

		box-sizing: border-box;
		background-color: #F8F8F8;

		// 键盘定位
		.fixed {
			.mask {
				position: fixed;
				top: 0;
				width: 100%;
				height: 100%;
				background-color: rgba(0, 0, 0, .2);
				z-index: 100
			}

			.fixeds {
				position: fixed;
				bottom: 0;
				width: 100%;
				z-index: 999;
			}
		}

		.paragraph {
			margin: 20rpx 0;
			background-color: #fff;
			font-size: 28rpx;

			.input {
				padding: 20rpx;
				display: flex;
				align-items: center;
				border-bottom: 2rpx solid #E8E8E8;
				background-color: #fff;

				.left {
					width: 30%;


					// 微信支付图标
					.pay {
						font-size: 40rpx;
						color: #6bcc03;
					}
				}

				.right {
					flex: 1;

					// 车牌信息
					.carnumber {
						display: flex;
						align-items: center;

						// 城市
						.city {
							width: 50rpx;
							height: 50rpx;
							display: flex;
							justify-content: center;
							align-items: center;
							background-color: #4989ff;
							color: #fff;
							border-radius: 5rpx;
							margin-right: 10rpx;
							box-sizing: border-box;
						}

						.number {
							flex: 1;
							font-size: 26rpx;
							padding-left: 20rpx;
						}
					}



				}



				.flex {
					display: flex;
					justify-content: flex-end;

				}

				// 微信支付布局
				.payflex {
					display: flex;
					justify-content: space-around;
				}
			}


			// 上传证件
			.upload {
				padding: 20rpx;
				display: flex;
				justify-content: space-between;
				align-items: center;

				.img {
					width: 30%;
					box-shadow: 1rpx 1rpx 10rpx #E3E3E3;
					position: relative;
					.close{
						position: absolute;
						top: 0;
						right: 0;
						width: 40rpx;
						height: 40rpx;
						background-color: #f00;
						color: #fff;
						z-index: 9;
						display: flex;
						justify-content: center;
						align-items: center;
					}
					.header {
						position: relative;
						display: flex;
						justify-content: center;
						align-items: center;
						flex-direction: column;
						height: 160rpx;
						color: #e1e1e1;

						.size {
							font-size: 80rpx;
						}
					}

					.txt {
						height: 60rpx;
						background-color: #007AFF;
						color: #fff;
						display: flex;
						justify-content: center;
						align-items: center;
					}
				}
			}
		}



		// 底部按钮
		.bottom {
			position: fixed;
			bottom: 0;
			width: 100%;
			height: 100rpx;
			background-color: #555;
			color: #fff;
			display: flex;
			justify-content: space-between;
			align-items: center;
			z-index: 99;
			box-sizing: border-box;

			// 运费相关
			.left {
				padding: 0 20rpx;
				display: flex;
				align-items: center;
				width: 20%;
				justify-content: space-between;
			}

			.right {
				width: 30%;
				background-color: #007AFF;
				height: 100%;
				display: flex;
				justify-content: center;
				align-items: center;
			}


			.auth {
				position: relative;

				.getuser {
					position: absolute;
					top: 0;
					left: 0;
					width: 100%;
					height: 100%;
					z-index: 999;
					opacity: 0;
				}
			}

		}
	}
</style>
